$(function () {
//分类框选择
    var ddArray = $("dl dd");
    var img01 = $("#img01").find('img');
    var spanArray = $('.classify span');
    var span1 = $("dl span");
    $(ddArray[0]).css("background", "rgb(245, 85, 85)").css("color", "black");
    $(span1[0]).css("color", "rgb(245, 85, 85)");
    $(ddArray[0]).on('mouseenter', function () {
        $(this).css("background", "rgb(245, 85, 85)").css("color", "black");
        $(img01).attr("src", "img/Snipaste_2025-04-29_14-33-46.png");
        $(span1[0]).css("color", "rgb(245, 85, 85)");
        $(ddArray[1]).css("background", "white").css("color", "black");
        $(span1[1]).css("color", "white");
        $(ddArray[2]).css("background", "white").css("color", "black");
        $(span1[2]).css("color", "white");
    })
    $(ddArray[1]).on('mouseenter', function () {
        $(this).css("background", "rgb(245, 85, 85)").css("color", "white");
        $(img01).attr("src", "img/Snipaste_2025-04-29_17-22-22.png");
        $(span1[1]).css("color", "rgb(245, 85, 85)");
        $(ddArray[0]).css("background", "white").css("color", "black");
        $(span1[0]).css("color", "white");
        $(ddArray[2]).css("background", "white").css("color", "black");
        $(span1[2]).css("color", "white");
    })
    $(ddArray[2]).on('mouseenter', function () {
        $(this).css("background", "rgb(245, 85, 85)").css("color", "white");
        $(img01).attr("src", "img/Snipaste_2025-04-30_09-47-33.png");
        $(span1[2]).css("color", "rgb(245, 85, 85)");
        $(ddArray[0]).css("background", "white").css("color", "black");
        $(span1[0]).css("color", "white");
        $(ddArray[1]).css("background", "white").css("color", "black");
        $(span1[1]).css("color", "white");
    })

    // / 中间
    var headerArray = $('#header a');
    var center01 = $('#center01');
    var center02 = $('#center02');
    var center03 = $('#center03');
    var center04 = $('#center04');

    $(headerArray[0]).on("mouseenter", function () {
        $(this).css("color", "red");
        headerArray.not(this).css("color", "black");
        center01.show();
        center02.hide();
        center03.hide();
        center04.hide();
    })
    $(headerArray[1]).on("mouseenter", function () {
        $(this).css("color", "red");
        headerArray.not(this).css("color", "black");
        center02.show();
        center01.hide();
        center03.hide();
        center04.hide();
    })
    $(headerArray[2]).on("mouseenter", function () {
        $(this).css("color", "red");
        headerArray.not(this).css("color", "black");
        center03.show();
        center01.hide();
        center02.hide();
        center04.hide();
    })
    $(headerArray[3]).on("mouseenter", function () {
        $(this).css("color", "red");
        headerArray.not(this).css("color", "black");
        center04.show();
        center01.hide();
        center02.hide();
        center03.hide();
    })

    $(headerArray[0]).on("mouseleave", function () {
        $(this).css("color", "blue");
        headerArray.not(this).css("color", "black");
    })
    $(headerArray[1]).on("mouseleave", function () {
        $(this).css("color", "blue");
        headerArray.not(this).css("color", "black");
    })
    $(headerArray[2]).on("mouseleave", function () {
        $(this).css("color", "blue");
        headerArray.not(this).css("color", "black");
    })
    $(headerArray[3]).on("mouseleave", function () {
        $(this).css("color", "blue");
        headerArray.not(this).css("color", "black");
    })
    //图片翻转
    // 水平镜像翻转
    $('.mytupian').hover(
        function() {
            $(this).animate({
                rotate: '180deg'
            }, 500);
        },
        function() {
            $(this).animate({
                rotate: '0deg'
            }, 500);
        }
    );

})


$(function () {
    $("#Submit").click(function () {
        var Search = $("#Search").val();
        window.location = "http://www." + Search + ".com";
    })


    $("#mybtn").click(function () {
        var file = $('#file')[0].files[0];
        if (file) {
            var reader = new FileReader();
            reader.onload = function (e) {
                var img = $('<img>').attr('src', e.target.result)
                    .css("border-radius", "50%").css("width", "35px").css("height", "35px");
                $('#myModal').modal('toggle')
                var username = $("#username").val();
                $("#denglu").html(img).css("margin-top", "-10px");
                $("#zhuce").html(username);
            };
            reader.readAsDataURL(file);
        }
    });
})